<template>
    <div>
        <div class="head-img">
            <img src="../images/article-top.jpg" alt="" width="100%" height="100%">
        </div>
        <!--文章列表-->
        <div class="article-details">
            <div class="header">
                <div class="list">
                    <ul  class="nav navbar-nav ">
                        <li><router-link to="/"><i class="glyphicon glyphicon-home"></i></router-link></li>
                        <li>文章详情</li>
                    </ul>
                </div>
            </div>
            <div class="article-content">
                <div v-if="article">
                    <div class="article-title">{{article.title}}</div>
                    <div class="article-time">{{date('Y年m月d日', article.create_at)}}</div>
                    <div class="article-body" v-html="article.content"></div>
                </div>
            </div>
        </div>
    </div>
</template>

<script>
    require('./article-details.css');
    var urlParm=require('./lib/urlParm');
    var created = function() {
        var self=this;
        var url=urlParm.default();
        this.id=url.id;
        if(this.id) {
            JxSdk.content.articleGet(this.id).then(function (data) {
                self.article = data.article;
            })
        } else {
            JxSdk.content.articleGetByTitle(decodeURI(url.name)).then(function (data) {

                console.log(data);
                self.article = data.article;
                self.id=data.article.id;
            }).catch(function(e) {
                alert(e);
                self.article = null;
                self.id='';
            })
        }
    };
    module.exports={
        data:function () {
            return{
                id: null,
                article: null,
            }
        },
        methods:{
            date: JxSdk.time.date,
        },
        created: created,
        beforeRouteUpdate: function(to, from, next) {
            next();
            created.apply(this);
        }
    }

</script>